<template>
  <view class="container screen-width">
    <view class="per-content">
      <view class="top flex items-middle space-between">
        <view>置顶</view>
        <view>
          <switch
            @change="switch1Change"
            :checked="checked"
            style="transform:scale(0.7)"
            color="#1786ff"
          />
        </view>
      </view>
      <view class="list">
        <radio-group @change="radioChange">
          <label
            class="list-item flex items-middle space-between"
            v-for="(item, index) in list"
            :key="index"
          >
            <view>{{item.text}}</view>
            <view>
              <radio
                :value="item.value"
                style="transform:scale(0.8)"
                :checked="item.value === current"
              />
            </view>
          </label>
        </radio-group>
      </view>
    </view>
    <Festival></Festival>
  </view>
</template>
<script>
import {
  setUpUserBusinessCardPrivacyCompetence,
  topUserBusinessCard
} from "../../util/api/userCard";
export default {
  data() {
    return {
      current: "0", // 权限状态
      list: [
        { value: "0", text: "所有人可见" },
        { value: "1", text: "仅自己可见" }
      ],
      privacyStatus: 0, // 置顶状态
      id: "", // 名片ID
      checked: false,
      topStatus: ""
    };
  },
  onLoad(e) {
    (this.id = e.id), (this.current = e.privacyStatus);
    this.topStatus = e.cardTopStatus;
    if (this.topStatus === "0") {
      this.checked = false;
    } else {
      this.checked = true;
    }
  },
  methods: {
    switch1Change: function(e) {
      this.checked = e.target.value;
      if (this.checked) {
        this.topStatus = "1";
      } else {
        this.topStatus = "0";
      }
      this.setCardTop();
    },
    radioChange: function(evt) {
      console.log(evt.target.value);
      for (let i = 0; i < this.list.length; i++) {
        if (this.list[i].value === evt.target.value) {
          this.privacyStatus = evt.target.value;
          this.current = i;
          this.setPermission();
          break;
        }
      }
    },
    // 设置名片可见状态
    async setPermission() {
      let params = {
        id: this.id,
        privacyStatus: this.privacyStatus
      };
      const data = await setUpUserBusinessCardPrivacyCompetence(params);
      if (data.code === 200) {
        uni.showToast({
          title: "修改成功",
          icon: "none"
        });
      } else {
        uni.showToast({
          title: data.messages,
          icon: "none"
        });
      }
    },
    // 设置名片置顶状态
    async setCardTop() {
      let params = {
        id: this.id,
        cardTopStatus: this.topStatus
      };
      const data = await topUserBusinessCard(params);
      if (data.code === 200) {
        uni.showToast({
          title: "修改成功",
          icon: "none"
        });
      } else {
        uni.showToast({
          title: data.messages,
          icon: "none"
        });
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.container {
  padding: 0 15px;
  box-sizing: border-box;
  height: 100vh;
  background: #ffffff;
  .per-content {
    width: 100%;
    padding: 10px 0;
  }
  .top {
    padding: 10px 0;
  }
  .list {
    .list-item {
      padding: 10px 0;
      border-top: 1px solid #c0c0c0;
    }
    // .list-item:last-child{
    //     border: none;
    // }
  }
}
</style>